<template>
    <!-- 查看文件日志 -->
    <el-dialog :title="'文件详情: ' + data.originalName" :visible.sync="dialogVisible" :close-on-click-modal="false"
        @close="onClose">
        <el-scrollbar :native="false" style="height: 400px;">
            <el-row v-for="(item, index) in detailInfos">
                <el-descriptions
                    :title="'时间线' + ((total - index) === total ? ': 最新' : (total - index)) + ': ' + item.createTime"
                    size="medium" border :column="4">
                    <el-descriptions-item label="操作类型">
                        <el-tag
                            :type="item.operationType === '新增' ? 'success' : item.operationType === '删除' ? 'danger' : item.operationType === '修改' ? 'warning' : item.operationType === '邮件分享' ? '' : item.operationType === '邮件单独分享' ? 'warning' : item.operationType === '下载' ? 'warning':item.operationType === '系统分享' ? 'success' : 'info' ">
                            {{ item.operationType }}
                        </el-tag>
                    </el-descriptions-item>
                    <el-descriptions-item label="内容">{{ item.content }}</el-descriptions-item>
                    <el-descriptions-item label="操作人">{{ item.createUser }}</el-descriptions-item>
                    <el-descriptions-item label="收取人">{{ item.receiverName }}</el-descriptions-item>
                </el-descriptions>
            </el-row>
        </el-scrollbar>


        <div style="width:100%;text-align: center;">
            <el-button @click="onClose" type="primary" plain style="margin-top: 5px;">关闭</el-button>
        </div>
    </el-dialog>
</template>

<script>
import request from '@/utils/request'

export default {
    name: "viewDetailDialog",
    props: {
        visible: {
            type: Boolean,
            default: false
        }
        , data: {
            type: Object,
            default: () => ({})
        }
    }
    , data() {
        return {
            detailInfos: []
            , dialogVisible: this.visible
            , total: 0
        }
    }
    , methods: {
        onClose() {
            this.dialogVisible = false;
            this.$emit('close');
        }
        , getDetailRequest() {
            return request({
                url: '/file-share/detail/' + this.data.id
                , method: 'get'
            })
        }
    }
    , mounted() {
        this.getDetailRequest().then(res => {
            if (res && res.code === 200) {
                for (let item of res.data) {
                    let operationType = item.operationType;
                    if (operationType === 'ADDITION') {
                        item.operationType = '新增';
                    } else if (operationType === 'DELETE') {
                        item.operationType = '删除';
                    }
                    else if (operationType === 'UPDATE') {
                        item.operationType = '修改';
                    } else if (operationType === 'SHARE_EMAIL') {
                        item.operationType = '邮件分享';
                    } else if (operationType === 'SHARE_EMAIL_SINGLE') {
                        item.operationType = '邮件单独分享';
                    } else if (operationType === 'SYSTEM_SHARE') 
                    {
                        item.operationType = '系统分享';
                    }
                    else {
                        item.operationType = '下载';
                    }
                    if (!item.content || item.content.length === 0) {
                        item.content = '无';
                    }
                    if (!item.receiver || item.receiver.length === 0) {
                        item.receiver = '无';
                    }
                }
                this.detailInfos = res.data;
                this.total = res.data.length;
            }
        })
            .catch(err => {
                console.log(err)
            })
    }
}
</script>

<style scoped></style>